<template>
  <div class="infinite-container express">
    <mu-divider></mu-divider>
    <div class="recieve-info bgwhite" v-if="addresses.length > 0">
      <mu-divider></mu-divider>
      <section class="address-list" v-for="(v, index) in addresses" :key="index">
        <mu-flexbox>
          <mu-flexbox-item :grow="5" class="item-left" @click.native="clickHandle(v)">
            <mu-flexbox>
              <mu-flexbox-item>
                {{v.consigneeName}}
                <small class="t6">{{v.flag === 1 ? '（当前默认）': ''}}</small>
              </mu-flexbox-item>
              <mu-flexbox-item class="text-right">{{v.consigneePhone}}</mu-flexbox-item>
            </mu-flexbox>
            <div class="mt10 t3">{{v.province}} {{v.city}} {{v.county}} {{v.addressDetail}}</div>
          </mu-flexbox-item>
          <mu-flexbox-item class="center" @click.native="modifyHandle(v)" v-show="!canDelete">
            <img src="../../assets/wzhis/icon_bianji.png" width="22" />
          </mu-flexbox-item>
          <mu-flexbox-item class="center" v-show="canDelete">
            <mu-checkbox
              :key="v.addrId"
              name="jueseGroup"
              v-model="arrDelete"
              label
              :nativeValue="v.addrId+''"
            ></mu-checkbox>
          </mu-flexbox-item>
        </mu-flexbox>
      </section>
    </div>
    <!-- <div class="not-found" v-else>
      <div>暂无数据</div>
    </div>-->

    <div class="pd20 login mt20">
      <mu-raised-button
        label="+新增收货地址"
        @click="addAddress"
        fullWidth
        primary
        class="btn-login"
        v-show="!canDelete"
      ></mu-raised-button>
      <mu-raised-button
        label="删除"
        @click="deleteAction"
        fullWidth
        primary
        class="btn-login"
        v-show="canDelete"
      ></mu-raised-button>
    </div>

    <mu-dialog :open="showDialog" title="提示">
      {{dialogContent}}
      <div class="center login mt20">
        <mu-raised-button label="取消" @click="showDialog=false"></mu-raised-button>
        <mu-raised-button label="确定" @click="dialogConfirmHandle" primary></mu-raised-button>
      </div>
    </mu-dialog>
  </div>
</template>

<script>
import { commonAjaxJson, RESTFUL_API } from "../../api/api";
export default {
  data() {
    return {
      addresses: [],
      arrDelete: [],
      canDelete: false,
      mpiId: "",
      addrId: "",
      showDialog: false,
      dialogContent: "",
      dialogConfirmHandle: () => {},
      deleteText: "编辑地址",
      familyPerson: JSON.parse(sessionStorage.familyPerson || "{}"),
      redirect: ""
    };
  },
  mounted() {
    this.redirect = this.$route.query.redirect;
    this.getList();
  },
  methods: {
    addAddress() {
      this.$router.push("/setting/edit-address?action=add");
    },
    setDefault(v) {
      if (v.flag == 1) {
        return false;
      }
      this.showDialog = true;
      this.dialogContent = "确定设此地址设为默认地址吗？";
      this.dialogConfirmHandle = this.updatePostadressAll;
      this.addrId = v.id;
    },
    clickHandle(v) {
      sessionStorage.selectedAddress = JSON.stringify(v);
      this.$router.push({
        path: "/medicalHistory/submitOrder"
      });
    },
    deleteAction() {
      if (this.arrDelete.length === 0) {
        return false;
      }
      this.showDialog = true;
      this.dialogContent = "确定要删除这些地址吗？";
      this.dialogConfirmHandle = this.delPostadressAll;
    },
    setDeleteAbled() {
      this.canDelete = !this.canDelete;
      this.deleteText = this.canDelete ? "完成" : "编辑地址";
    },
    modifyHandle(v) {
      localStorage.modifyAddress = JSON.stringify(v);
      this.$router.push("/setting/edit-address");
    },
    updatePostadressAll() {
      
      commonAjaxJson(
        [this.mpiId, this.addrId],
        RESTFUL_API.diagnosisPayTradeService,
        "updatePostadressAll"
      ).then(res => {
        
        if (res.data.code == 100) {
          location.reload();
        }
      });
    },
    getList() {
      
      commonAjaxJson(
        RESTFUL_API.getList,
        { userId: sessionStorage.getItem("userId") },
        true
      ).then(res => {
        

        if (res.data.code == 200) {
          this.addresses = res.data.data;
        }
      });
    },
    delPostadressAll() {
      
      console.log("deleteAddress");
      commonAjaxJson(
        RESTFUL_API.diagnosisPayTradeService,
        [this.arrDelete],
        true
      ).then(res => {
        
        if (res.data.code == 200) {
          location.reload();
        }
      });
    }
  },
  beforeDestroy() {}
};
</script>

<style lang="less">
@import "../../common/css/vars.less";
.express {
  .title-wrapper {
    padding: 0.5em 10px 0.5em 0;
    .title {
      border-left: 4px solid @color-primary;
      padding-left: 10px;
    }
    .icon-edit {
      font-size: 1.4em;
      color: @color-primary;
      position: relative;
      top: -4px;
    }
  }
  .address-list {
    border-bottom: 1px solid @color-border;
  }
  .item-left {
    border-right: 1px solid @color-border;
    padding-right: 1em;
  }
}
</style>
